<template>
  <div id="app">
    <HelloWorld>
    <template #yi>
     本周热搜 top5
    </template>
    
    <template #san>
    <ul>
      <li><div>#区块链</div><div>🔥96</div></li>
      <li><div>#数据挖掘</div><div>🔥91</div></li>
      <li><div>#无人机</div><div>🔥87</div></li>
      <li><div>#生命科学</div><div>🔥72</div></li>
      <li><div>#传感器</div><div>🔥60</div></li>
    </ul>

    <!-- <div>#区块链</div>
    <div>#数据挖掘</div>
    <div>#无人机</div>
    <div>#生命科学</div>
    <div>#传感器</div>  -->
    </template>
    </HelloWorld>

    <HelloWorld>
    <template #yi>
     可能感兴趣的人
    </template>
    <template #er>
      ↻ 换一批
    </template>
    
    <template #san>
    <ul>
      <li>
        <div>
          <p><span>李国盛</span> 🚹 52岁</p>
          <p>研究领域:机电一体化技术</p>
          <p>哈尔滨工业大学·教授</p>
        </div>
        <div><button>+关注</button></div>
      </li>
      <li>
        <div>
          <p><span>陈颖</span> 🚺 36岁</p>
          <p>研究领域:机电一体化技术</p>
          <p>哈尔滨工业大学·教授</p>
        </div>
        <div><button>+关注</button></div>
      </li>
     
    </ul>

    <!-- <div>#区块链</div>
    <div>#数据挖掘</div>
    <div>#无人机</div>
    <div>#生命科学</div>
    <div>#传感器</div>  -->
    </template>
    </HelloWorld>
  </div>
</template>

<script>
import HelloWorld from './components/HelloWorld.vue';

export default {
  name: 'App',
  components: {
    HelloWorld
  }
}
</script>

<style scoped>
button{
  padding: 3px 9px;
  border-radius: 15px;
  border: none;
  color: #fff;
  background-color: #037bff;
  margin-top: 20px;
}
span{
  font-size: 20px;
  font-weight: 700;
}
</style>
